<template>
  <vxe-layout-container vertical>
    <vxe-layout-header class="layout-header">
      <Query :queryConfig="QueryConfig" @QueryEvent="handleQuery"></Query>
    </vxe-layout-header>
    <vxe-layout-body class="layout-body">
      <vxe-grid ref="maingrid" v-bind="GridOptions">
        <template #operation="{ row }">
          <vxe-button :size="componentSize" mode="text" status="primary" content="开票" @click="handleReceive(row)"
            v-if="btnPromission.invoice.buttonCaption" />
            <vxe-button :size="componentSize" mode="text" status="success" content="开票确认" @click="handleInvoiceConfirm(row)"
            v-if="btnPromission.invoiconfirm.buttonCaption" />         
        </template>
        <template #invoiceStatus="{ row }">
          <vxe-tag v-if="row.kpzt == 'N'" status='error' content="未开票"></vxe-tag>
          <vxe-tag v-else status='success' content="已开票"></vxe-tag>
        </template>
      </vxe-grid>
      <vxe-pager :align="PagerConfig.align" :size="componentSize" :current-page.sync="PagerConfig.currentPage"
        :page-size.sync="PagerConfig.pageSize" :total="PagerConfig.total" @page-change="handlePageChange"></vxe-pager>
      <vxe-tip status="primary">
        开票明细
      </vxe-tip>
      <vxe-grid ref="childgrid" v-bind="ChildGridOptions" @toolbar-tool-click="handleChildToolClick">
        <template #operation="{ row }">
          <template v-if="hasEditStatus(row)">
            <vxe-button :size="componentSize" mode="text" status="primary" @click="handleChildSave(row)" content="保存" />
            <vxe-button :size="componentSize" mode="text" status="danger" @click="handleChildCancel" content="取消" />
          </template>
          <template v-else>
            <vxe-button :size="componentSize" mode="text" status="primary" content="编辑" @click="handleChildEdit(row)"
              v-if="btnPromission.edit.buttonCaption" />
              <vxe-button :size="componentSize" mode="text" status="danger" content="删除" @click="handleChildDelete(row)"
              v-if="btnPromission.delete.buttonCaption" />
          </template>
        </template>
        <template #invoiceStatus="{ row }">
          <vxe-tag v-if="row.kpzt == 'N'" status='error' content="未开票"></vxe-tag>
          <vxe-tag v-else status='success' content="已开票"></vxe-tag>
        </template>
      </vxe-grid>
    </vxe-layout-body>
  </vxe-layout-container>
</template>
<style></style>
<script>
import ProjectInvoice from './index.js';
export default ProjectInvoice;
</script>
